import React from 'react'
import values from '../../common/string'
import { Divide, SvgIcon } from '../../components/design'

import './styles.css'

const Footer = () => {

  // 第一排
  function firsRow() {
    return (
      <div style={{ width: '100px', height: '200px', backgroundColor: 'red' }}>
        {/* <SvgIcon iconHref='' /> */}
      </div>
    )
  }
  // 布局信息
  function relateInfoView() {
    return (
      <section className='footer_relateWrap'>
        {firsRow()}
        <div style={{ width: '100px', height: '200px', backgroundColor: 'red' }}></div>
        <div style={{ width: '100px', height: '200px', backgroundColor: 'red' }}></div>
        <div style={{ width: '100px', height: '200px', backgroundColor: 'red' }}></div>
      </section>
    )
  }

  // 制作人 制作时间
  function bottomView() {
    return (
      <section className='footer_tip'>
        <p>
          {values.footer_date}
        </p>
        <SvgIcon iconHref="#icon-iconzhengli-" />
        <p>
          {values.short_home_name}
        </p>
      </section>
    )
  }

  return (
    <main className='footer_wrap'>
      {relateInfoView()}
      <Divide height={'16px'} />
      <Divide height={'1px'} style={{ backgroundColor: '#1f1f1f' }} />
      {bottomView()}
    </main>
  )
}

export default Footer
